<!doctype html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="./css/bootstrap/bootstrap.min.css" >
	<!--引入字体样式-->
	<link rel="stylesheet" href="./css/fontawesome/all.min.css">
    <title>简易购</title>
  </head>
  <body>
    <!-- 导航条-->
    <div class="container-fluid">
    	<nav class="navbar navbar-expand-lg navbar-light bg-light">
    		<div class="container">
    			<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
    			 aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
    				<span class="navbar-toggler-icon"></span>
    			</button>
    			<span class="navbar-text text-dark">
    				简易购欢迎您！ 请
    			</span>
    			<div class="collapse navbar-collapse" id="navbarSupportedContent">
    				<ul class="navbar-nav mr-auto">
    					<li class="nav-item ">
    						<a class="nav-link text-danger" href="#">登录<span class="sr-only">(current)</span></a>
    					</li>
    					<li class="nav-item">
    						<a class="nav-link text-dark pl-1" href="#">免费注册</a>
    					</li>
    				</ul>
    				<form class="form-inline my-2 my-lg-0">
    					<a class="nav-link  pr-4 text-dark" href="#">我的订单</a>
    					<a class="nav-link  pl-2 text-dark" href="#">我的简易购</a>
    				</form>
    			</div>
    		</div>
    	</nav>
    </div>
    <!-- /导航条 -->
    <!-- 内容 -->
    <div class="container">
    	<h2 style="font-weight: bold">简易购</h2>
    	<hr color="red"style="height:2px">
    <div class="row">
    	<div class="col-2"></div>
    <!-- 注册框 -->
    <div class="col-8">
    <div class="card border-dark ">
      <div class="card-header border-dark form-inline ">
    	  <div class="col-4" style="font-size: 20px;font-weight: bold">
    		 登录
    	  </div>
    	  <div class="col-4"></div>
        <div class="col-4 text-right" style="font-size: 20px;font-weight: bold">
        		我无账号, 去<a href="register.html"style="font-weight: bold;" class="text-info">免费注册</a>
        </div>
      </div>
      <div class="card-body">
        <div class="row">
    		<div class="col-3"></div>
    		<div class="col-6">
    			<form>
    			  <div class="form-group row">
    			    <div class="col">
    			      <input type="text" class="form-control" id="inputEmail3" placeholder="手机/邮箱/用户名">
    			    </div>
    			  </div>
    			  <div class="form-group row">
    			    <div class="col">
    			      <input type="password" class="form-control" id="inputPassword3" placeholder="密码">
    			    </div>
    			  </div>
				  <div class="form-group row">
				    <div class="col">
				      <div class="form-check">
				        <input class="form-check-input" type="checkbox" id="gridCheck1">
				        <label class="form-check-label" for="gridCheck1">
				          记住密码
				        </label>
				      </div>
				    </div>
				  </div>
    			  <div class="form-group row">
    			    <div class="col-12">
    			      <button type="submit" class="btn btn-danger w-100">登录</button>
    			    </div>
    			  </div>
    			</form>
    		</div>
    		<div class="col-3"></div>
    	</div>
      </div>
    </div>
    </div>
    <div class="col-2"></div>
    <!-- /注册框 -->
    </div>
    </div>
    <!-- /内容 -->

    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="./js/plugins/jQuery/jquery-3.3.1.slim.min.js"></script>
    <script src="./js/plugins/bootstrap/popper.min.js"></script>
    <script src="./js/plugins/bootstrap/bootstrap.min.js"></script>
  </body>
</html>
